<template>
    <div class="s">
        <button @click="goBack">返回</button>
        以/:id/获取的是这个值：{{msg}}
        <hr> 以?id=1获取的是这个值：{{msg2}}
    </div>
</template>
<script>
export default {
    data() {
        return {
            msg: '',
            msg2: ''
        }
    }, created() {
        console.log(this.$route.params);
        this.msg = this.$route.params.id; //$route具备信息，可以从中获取数据
        this.msg2 = this.$route.query.id; //$route具备信息，可以从中获取数据
    }, mounted() {
        console.log('mounted被触发了');
    }, updated() {
        console.log('updated被触发了');
    }, methods: {
        goBack() { //$router对象具备一些功能
            this.$router.go(-1); //历史记录的返回
        }
    }
}
</script>
<style>
.s {
    height: 400px;
    background-color: yellowgreen;
}
</style>
